<template>
    <div>
        <div class="top">
            <Input placeholder="搜索标题" style="width:300px" v-model="formData.title"></Input>
            <Button type="primary" icon="ios-search" @click="searchQuery">搜索</Button>
            <Button type="primary" @click="addSurvey">新增</Button>
        </div>
        <Table :columns="columns" :data="dataList" border></Table>
        <div style="position: relative">
            <Page style="text-align: right;padding-top: 10px;" :page-size="formData.rows" @on-page-size-change="pageSizeFn" @on-change="pageFn" :total="total" show-sizer show-total></Page>
        </div>
    </div>
</template>
<script>
    import qs from 'qs'
    import API from '../../config/api'
    export default {
        data() {
            return {
                searchData: {
                    name: "",
                    pageSize:20,
                    pageNum:1
                },
                columns: [
                    {
                        title: "问卷ID",
                        key: "id"
                    },
                    {
                        title: "标题",
                        key: "title"

                    },
                    {
                        title: "开始时间",
                        key: "beginTime",
                        render: (h, params) => {
                            return h('span', params.row.beginTime.substring(0,11))
                        }
                    },
                    {
                        title: "结束时间",
                        key: "endTime",
                        render: (h, params) => {
                            return h('span', params.row.endTime.substring(0,11))
                        }
                    },
                    {
                        title: '调查结果',
                        key: 'action',
                        align: 'center',
                        render:(h, params)=>{
                            return h("div", [
                                h(
                                    "Button",
                                    {
                                        props: {
                                            type: "primary",
                                            size: "small"
                                        },
                                        style: {
                                            marginRight: "5px"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: "onlineResult",
                                                    params: {
                                                        id: params.row.id,
                                                        paperTitle: params.row.title
                                                    }
                                                });
                                            }
                                        }
                                    },
                                    "查看结果"
                                )]
                            )
                        }
                    },
                    {
                        title: "操作",
                        key: "action",
                        align: "center",
                        render: (h, params) => {
                            return h("div", [
                                h(
                                    "Button",
                                    {
                                        props: {
                                            type: "primary",
                                            size: "small"
                                        },
                                        style: {
                                            marginRight: "5px"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: "surveyAdd",
                                                    params: {
                                                        id: params.row.id,
                                                        type: 'notify'
                                                    }
                                                });
                                            }
                                        }
                                    },
                                    "修改"
                                ),h(
                                    "Button",
                                    {
                                        props: {
                                            type: "primary",
                                            size: "small"
                                        },
                                        style: {
                                            marginRight: "5px"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: "surveyAdd",
                                                    params: {
                                                        id: params.row.id,
                                                        type: 'query'
                                                    }
                                                });
                                            }
                                        }
                                    },
                                    "查看"
                                ),h(
                                    "Button",
                                    {
                                        props: {
                                            type: "primary",
                                            size: "small"
                                        },
                                        style: {
                                            marginRight: "5px"
                                        },
                                        on: {
                                            click: () => {
                                                this.removePaper(params.row.id)
                                            }
                                        }
                                    },
                                    "删除"
                                )
                            ]);
                        }
                    }
                ],
                dataList: [],
                total:0,
                editStatus: false,
                formData:{
                    title: '',
                    page: 1,
                    rows: 20
                }
            };
        },
        created(){
            this.query();
        },
        methods: {
            chooseTime() {

            },
            query(){
                let formData = new FormData();
                formData.append('title', this.formData.title);
                formData.append('page', this.formData.page);
                formData.append('rows', this.formData.rows);
                this.axios.post(API.GET_SURVERY_LIST, formData).then(res=>{
                    let data = res.data;
                    if (data.code == 200){
                        this.total = data.data.totalCount;
                        this.dataList = data.data.dataList;
                    }
                })
            },
            pageSizeFn(size){
                this.formData.rows = size;
                this.query();
            },
            pageFn(num){
                this.formData.page = num;
                this.query();
            },
            searchQuery() {
                this.formData.page = 1;
                this.query();
            },
            addSurvey(){
                this.$router.push({name: 'surveyAdd'})
            },
            removePaper(id){
                let data = {
                    id: id
                };
                this.axios.post(API.PAPER_DELETE, qs.stringify(data)).then(res=>{
                    let data = res.data;
                    if (data.code == 200){
                        this.query();
                        this.$Message.info('删除问卷成功');
                    }else{
                        this.$Message.info(data.msg);
                    }
                })
            }
        }
    };
</script>
<style scoped>
    .top {
        margin: 30px 0;
    }
</style>
